<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>首页</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/swiper.css"/>

    <!-- Demo styles -->
    <style>
    </style>

</head>
<body>
<div id="app" class="container" v-cloak>
  <div>
    <img v-src="'../../image/banner.jpg'" width="100%">
  </div>
  <div class="shop_container">
    <div class="shop_info">
    <div class="shop-avatar">
      <img v-src="'../../image/aboutUs_img.png'">
    </div>
    <div class="shop-content">
      <div class="shop-title">杨先生很酷的店</div>
      <div class="shop-detail">
        <span>在售商品<span style="color:#9d0152">32</span>个&nbsp;&nbsp;<span style="font-size:14px">|</span>&nbsp;&nbsp;444粉丝</span>
      </div>
    </div>
  </div>
  <div class="shop_desc">
  <span style="color:#007CFA">店铺描述：</span>
  欢迎大家来到我的店克里斯多夫关键时刻打更健康发生开关机卡拉丁发收款多麻烦时刻按时打卡am阿道夫发发生的
  </div>
  </div>
  <div class="shop_goods_container">
  <div class="shop_goods_info" v-for="(good, index) in goods" v-myclick="[good.goods_id, openGoodsDetail]">
    <img v-image-resize="{src:good.pic}" :key="good.goods_id" width="100%" >
    <div class="goods_name">
      {{good.title}}
    </div>
    <div class="goods_info_detail">
      <span>￥{{good.price}}</span>
      <span>{{good.sale_count}}人付款</span>
      <span>....</span>
    </div>
  </div>
  <div style="clear:both"></div>
</div>
<div>
<div class="home-activityCate" v-for="(content, index) in activities" style="padding-top:10px">
    <div class="home-activityCate-seckill-floor" v-bind:class="{'top-active':index==0}">
        <div class="home-activityCate-title-wrap" >
            <img :src="content.pic" v-myclick="[content.category_id, getActivityCate]" >
        </div>
        <div :class='"swiper-container"+index' style="padding-top:12px; background-color: white;">
            <div class="swiper-wrapper" style="transition-duration: 0ms; transform: translate3d(0px, 0px, 0px);" >
                <div class="swiper-slide" v-for="goodslist in content.goods">
                    <li class="home-activityCate-seckill-new-item" v-myclick="[goodslist.goods_id, openGoodsDetail]">
                        <div class="home-activityCate-seckill-item-img">
                            <img class="home-activityCate-seckill-photo" v-image-resize="{src:goodslist.new_pic?goodslist.new_pic:goodslist.pic}" >
                        </div>
                        <div class="home-activityCate-seckill-item-text">
                            <span class="home-activityCate-seckill-good-title">{{goodslist.new_title?goodslist.new_title:goodslist.title}}</span>
                            <!-- <span class="home-activityCate-seckill-new-price">券后价  <em>¥</em>{{goodslist.price}}</span> -->
                            <span class="home-activityCate-seckill-new-price" style="text-align:center"><span>¥{{goodslist.price}}</span><del class="home-activityCate-seckill-original-price" style="color:#333"><em>¥</em>{{goodslist.prime}}<hr></del></span>
                            <!-- <del class="home-activityCate-seckill-original-price"><em>¥</em>{{goodslist.prime}}<hr></del> -->
                        </div>
                    </li>
                </div>
                <div class="swiper-slide"  >
                    <div class=" home-activityCate-seckill-new-item" v-myclick="[content.category_id, getActivityCate]">
                        <div class="home-activityCate-seckill-item-img">
                            <img class="home-activityCate-seckill-photo" v-image-resize="{src:'../../image/more_good.png'}" >
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>
</body>
<script src="../../script/vue.js"></script>
<script src="../../script/api.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/components.js"></script>
<script src="../../script/swiper.js"></script>

<script>

    var MNActionButton,
        goods,
        swiper,
        state,
        activities,
        activitylength=0,
        mySwiper = new Array(),
        vm;
    var wx;
    apiready = function () {
        showProgress();
        UIScrollPicture = api.require('UIScrollPicture');
        MNActionButton = api.require('PIActionButton');
        wx = api.require('wx');
        setBSImg();
        var data = {
            member_id: getPrefs('member_id')
        };
        var callback = function (ret) {
            var home = ret.content;
            goods = home.homeGoods;
            activities = home.homeactivities;
            initApp();
            api.parseTapmode();
            swiper();
        };
        pinet.post(URL.getHomeData, data, callback);
        setRefreshHeaderInfo(refresh);

        api.addEventListener({
            name: 'home'
        }, function () {
            refresh();
        });
    };
    function refresh() {
        var data = {
            member_id: getPrefs('member_id')
        };
        var callback = function (ret) {
            var home = ret.content;
            goods = home.homeGoods;
            activities = home.homeactivities;
            if (vm) {
                vm.goods = home.homeGoods;
                vm.key++;
            } else {
                initApp();
            }
            api.refreshHeaderLoadDone();
        };
        var errback = function () {
            api.refreshHeaderLoadDone();
        };

        pinet.post(URL.getHomeData, data, callback, errback);
    }

    function initApp() {
        vm = new Vue({
            el: "#app",
            data: {
                goods: goods,
                listOf2col: true,
                url: URL.getHomeData,
                activities:activities,
                BSImg: Vue.BSImg,
                key:0
            },
            updated: function() {
              swiper();
            },
            methods: {
                openGoodsDetail: function (goods_id) {
                    openGoodsDetail(goods_id);
                },
                share: function (share) {
                    if (!getPrefs('token')) {
                        reLogin();
                        return;
                    }
                    var sharestr = share.url;
                    var tempstr = sharestr.split("&");
                    for(var i=0;i<tempstr.length;i++){
                      var iscloud = tempstr[i].indexOf("member_id=");
                      if(iscloud>=0){
                        var old_member_id = tempstr[i].split("=")[1];
                        break;
                      }
                    }
                    var member_id = getPrefs('member_id');
                    if(old_member_id!==member_id){
                      var str1 = sharestr.replace('member_id='+old_member_id, 'member_id='+member_id);
                      share.url  = str1;
                    }
                    onEvent('商品分享点击');
                    openMNActionButton(share);
                },
                getActivityCate: function (actid) {
                    var attributes = {
                        activityid: actid
                    };
                    openWin('../home/activity', {actid: actid});
                },
            },
        })
    }
    function swiper(){
      if(activities.length > activitylength){
        for(var i = activitylength; i < activities.length; i++)
         mySwiper[i] = new Swiper(('.swiper-container')+i, {
            pagination: '.swiper-pagination',
            slidesPerView: 3,
            paginationClickable: true,
            spaceBetween: 5,
            slidesOffsetBefore : 10,
            freeMode: true
        });
        activitylength = activities.length;
      }
    }

</script>
</html>
